import type { DirectiveBinding } from 'vue'
import { useUserStore } from '@/store/modules/user'
import { isArray } from 'lodash-es'

export const isAuth = (perms: string | string[]) => {
  // 获取用户权限，如果没有权限则默认为空数组
  const userStore = useUserStore()
  const userPermissions = [...(userStore.permissions || []), ...(userStore.roles || []).map((role) => `ROLE:${role}`)]
  /**
   * 检查用户是否具有指定权限
   * @param p 需要检查的权限，可以是单个权限字符串或权限数组
   * @returns 返回用户是否具有指定权限
   */
  const hasPerms = (p: string | string[]) => {
    // 如果权限是数组，则根据操作符进行逻辑判断
    if (isArray(p)) {
      if (p.length === 0) {
        // 处理空数组的情况，可以根据业务需求调整
        return false
      }
      const [operator, ...temp] = p
      switch (operator) {
        case 'and':
          return temp.every(hasPerms)
        case 'or':
          return temp.some(hasPerms)
        case 'not':
          return !temp.some(hasPerms)
        default:
          return p.every(hasPerms)
      }
    } else {
      // 如果权限是单个字符串，直接检查用户权限中是否包含该权限
      return userPermissions.includes(p)
    }
  }

  const hasPerms1 = hasPerms(perms)
  console.debug(`auth[${perms}]: `, hasPerms1)
  return hasPerms1
}

/**
 * 权限控制指令
 * 用于在元素上根据用户权限动态显示或隐藏元素
 */
export default {
  /**
   * 在元素挂载时执行权限检查
   * @param el HTML元素
   * @param binding 指令绑定的对象，包含权限值
   */
  mounted(el: HTMLElement, binding: DirectiveBinding) {
    const { value } = binding
    if (!value) {
      return
    }

    // 如果没有提供权限值或用户不具有指定权限，则移除该元素
    if (!value || !isAuth(value)) {
      el.remove()
    }
  }
}
